<template>
  <div style="padding: 10px 40px; display: flex; width: auto;">
    <el-tabs v-model="activeName" @tab-click="handleClick" :stretch="stretch" style="width: 100%;">
      <el-tab-pane label="基本信息" name="1" :lazy="lazy">
        <appUser :appUser="appUser"></appUser>
      </el-tab-pane>
      <el-tab-pane label="扩展信息" name="2" :lazy="lazy">
        <appUserExt :appUserExt="appUserExt" :userId="userId"></appUserExt>
      </el-tab-pane>
      <el-tab-pane label="钱包信息" name="3" :lazy="lazy">
        <appUserWallet :appUserWallet="appUserWallet" :userId="userId"></appUserWallet>
      </el-tab-pane>
      <el-tab-pane label="会员信息" name="4" :lazy="lazy">
        <appUserVip :userId="userId"></appUserVip>
      </el-tab-pane>
      <el-tab-pane label="登录信息" name="5" :lazy="lazy">
        <logInfo :phone="userName" :userId="userId"></logInfo>
      </el-tab-pane>
      <el-tab-pane label="封号信息" name="6" :lazy="lazy">
        <userBanned :phone="userName"></userBanned>
      </el-tab-pane>
      <el-tab-pane label="充值明细" name="7" :lazy="lazy">
        <payLog :userId="userId" :logType="[211,210]"></payLog>
      </el-tab-pane>
      <el-tab-pane label="提现明细" name="8" :lazy="lazy">
        <payLog :userId="userId" :logType="[103]"></payLog>
      </el-tab-pane>
      <el-tab-pane label="收入明细" name="9" :lazy="lazy">
        <payLog :userId="userId" :logType="[201,202,203,204,205,206,207,208,209,212,214,215,216,218]"></payLog>
      </el-tab-pane>
      <el-tab-pane label="支出明细" name="10" :lazy="lazy">
        <payLog :userId="userId" :logType="[102,103,104,105,107,108,110]"></payLog>
      </el-tab-pane>
      <el-tab-pane label="下级用户" name="11" :lazy="lazy">
        <indexInvited :upid="userId"></indexInvited>
      </el-tab-pane>
      <el-tab-pane label="手机号修改记录" name="12" :lazy="lazy">
        <phoneLog :upid="platformId"></phoneLog>
      </el-tab-pane>
    </el-tabs>
  </div>

</template>

<script>
import {getAppUser,} from "@/api/service/appUser/appUser";
import {getAppUserExt,} from "@/api/service/appUser/appUserExt";
import {getAppUserWallet,} from "@/api/service/appUser/appUserWallet";


import appUser from "./appUser.vue"
import appUserExt from "./appUserExt.vue"
import appUserWallet from "./appUserWallet.vue"
import logInfo from "@/views/monitor/logininfor/query.vue"
import userBanned from "../userBanned/query.vue"
import payLog from "../pay/payLog/query.vue"
import phoneLog from "./phoneLog.vue"
import indexInvited from "./indexInvited.vue"
import appUserVip from "@/views/service/appUser/appUserVip.vue";

export default {
  dicts: ['check_status', 'sys_yes_no', 'appuser_status', 'sys_user_sex', 'online_status', 'account_type', 'app_yes_no'],
  props: {
    userId: {
      type: String,
      default: '-1'
    },
    platformId: {
      type: Number,
      default: '-1'
    },
    userName: {
      type: String,
      default: '-1'
    }
  },
  components: {
    phoneLog,
    indexInvited,
    appUser,
    appUserExt,
    appUserWallet,
    appUserVip,
    logInfo,
    userBanned,
    payLog
  },
  data() {
    return {
      lazy: true,
      appUser: {},
      appUserExt: {},
      appUserWallet: {},
      activeName: '1',
      stretch: true
    };
  },
  created() {
    this.getAppUser()
  },
  methods: {
    handleClick(tab, event) {
    },
    // 查询基础信息
    getAppUser() {
      getAppUser(this.userId).then(response => {
        this.appUser = response.data
      });
    },
    // 查询扩展信息
    getAppUserExt() {
      getAppUserExt(this.userId).then(response => {
        this.appUserExt = response.data
      });
    },
    // 查询钱包信息
    getAppUserWallet() {
      getAppUserWallet(this.userId).then(response => {
        this.appUserWallet = response.data
      });
    }
  },
  watch: {
    activeName(newValue, oldValue) {
      switch (newValue) {
        case '1':
          this.getAppUser()
          break;
        case '2':
          this.getAppUserExt()
          break;
        case '3':
          this.getAppUserWallet()
          break;
        default:
          break;
      }
    }
  },
};
</script>

<style lang="scss" scoped>


</style>
